<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>html标签的分类</title>
    <style>
    span,input,button,div,a,strong{
        background-color: red;
        width:500px;
        height: 50px;
        left:200px;
        right:200px;
        padding-top:20px;
        margin-left: 10px;
        display: block;
        /* display显示为：block 块/inline 内联 */
    }
    
    </style>
</head>
<body>
    <!-- 块标签
        div,p,ul-li,dl-dt-dd,h1~h6；
        特点1：独占一行
        特点2：能够设置width,hight
     -->
    <div>div</div>
    <p>p</p>
    <h1>h1</h1>
     <!-- 
        内联标签
        a,span,i,em,strong
        特点1：并排显示
        特点2：不能设置宽高
        特点3：不能设置margin-top,margin-bottom
        特点4：可以设置margin-left,margin-right;
        特点5：可以设置padding;

      -->
      <a href="www.baidu.com">百度</a>
      <span>span</span>
      <i>i</i>
      <em>em</em>
      <strong>strong</strong>
      <!-- 
        内联块 img,input,button
        1,并排显示  2,能设置width,height(不能设置left,right)

       -->
       <input type="text">
       <button>在？点一下</button>
</body>
</html>